<template>
  <div class="event-common">
    <div class="event-content">{{ event.current.content }}</div>
    <div class="event-option-wrap">
      <div class="event-option" v-for="option in event.current.optionArray" @click="selectRoute(option.result)">{{ option.content }}</div>
    </div>
  </div>
</template>

<script>
import Event from '@/game/data/event'

export default {
  name: 'EventCommon',

  data() {
    return {
      event: {
        id: 0,
        progress: '',
        data: {},
        current: {
          initiator: '',
          content: '',
          optionArray: []
        }
      },
      updateFlag: {
        map: {
          move: 0,
        },
        event: {
          select: 0
        }
      }
    }
  },

  computed: {
    renderCount() {
      return this.$store.state.renderCount
    },
  },

  watch: {
    renderCount() {
      refreshData(this)
    },
    'updateFlag.map.move' (val) {
      if (val) {
        refreshData(this)
        initEvent(this)
        initEventProgress(this)
      }
    },
    'updateFlag.event.select' (val) {
      if (val) {
        refreshData(this)
        initEventProgress(this)
      }
    }
  },

  mounted() {
    refreshData(this)
    initEvent(this)
    initEventProgress(this)
  },

  methods: {
    selectRoute(result) {
      this.$game.data.state.event.common.progress = result
      this.updateFlag.event.select = this.updateFlag.event.select + 1
      if (!this.$game.tempData.event.complete && result === 'end') {
        this.$game.data.state.event.lastComplete = true
        this.$game.tempData.updateFlag.event.complete = this.$game.tempData.updateFlag.event.complete + 1
      }
    },
  },
}

let refreshData = (that) => {
  that.event.id = that.$game.data.state.event.common.id
  that.event.progress = that.$game.data.state.event.common.progress

  that.updateFlag.map.move = that.$game.tempData.updateFlag.map.move
}

let initEvent = (that) => {
  that.event.data = Event['event' + that.event.id]
  if (that.$game.tempData.event.complete) {
    that.$game.data.state.event.common.progress = 'again'
    that.event.progress = 'again'
  }
}

let initEventProgress = (that) => {
  that.event.current.initiator = Event['event' + that.event.id][that.event.progress].initiator
  that.event.current.content = Event['event' + that.event.id][that.event.progress].content
  that.event.current.optionArray = Event['event' + that.event.id][that.event.progress].option
}
</script>

<style lang="scss">

</style>
